/* jshint esversion: 6 */
(() => {
    // 核心样式管理
    PetUI.Style = function () {
        $.Style = null;
        // style
        let style = document.createElement('style');
        document.head.appendChild(style);
        // 样式列表
        let stylelist = {};
        let StyleUpdate = () => {
            for (let key in stylelist) {
                if (stylelist.hasOwnProperty(key)) {
                    text += key + "{ \n";
                    let css = stylelist[key];
                    if (typeof css == "string") {
                        text += css;
                    } else {
                        for (let i = 0; i < css.length; i++) {
                            text += css[i] + ";\n";
                        }
                    }
                    text += "}\n";
                }
            }
            style.innerText = text;
        };
        // 样式修改
        Object.defineProperty($, "Style", {
            set: function (name) {
                // CSS 由 选择器 { 声明列表 } 构成
                if (name.selector) {
                    if (typeof name.statement == "string") {
                        stylelist[name.selector] = name.statement;
                    } else {
                        if (name.statement && name.statement.length > 0) {
                            stylelist[name.selector] = name.statement;
                        }
                    }
                    StyleUpdate();
                }
            },
            get: function () {
                let $ = function (selector, statement) {
                    if (statement != undefined && statement != undefined) {
                        $.selector = selector;
                        $.statement = statement;
                        $.Update();
                    } else if (typeof selector == "string" && stylelist[selector]) {
                        $.selector = name;
                        $.statement = stylelist[name];
                        return $;
                    }
                };
                $.css = "";
                $.selector = null;
                $.statement = [];
                $.stylelist = stylelist;
                $.Update = () => {
                    if ($.selector) {
                        if (typeof $.statement == "string") {
                            stylelist[$.selector] = $.statement.split(";");
                        } else {
                            if ($.statement && $.statement.length > 0) {
                                stylelist[$.selector] = $.statement;
                            }
                        }
                        StyleUpdate();
                    }
                };
                $.StyleUpdate = StyleUpdate;
                Object.defineProperty($, "css", {
                    set: function (name) {
                        $.statement.push(name);
                    }
                });
                return $;
            }
        });
        return $;
    };
    //------------- 附加功能 -------------
    // 创建元素
    PetUI.Create = function (type, Parent) {
        var create = document.createElement(type);
        for (var i in PetUI.Additional) {
            create[i] = PetUI.Additional[i];
        }
        Parent = Parent ? Parent : this;
        if (Parent.nodeName != undefined) {
            Parent.appendChild(create);
        }
        create.Create = PetUI.Create;
        return create;
    };
    // 禁止菜单显示
    PetUI.BanMenu = function () {
        document.oncontextmenu = function (evt) {
            var event = evt || window.event;
            if (event && event.returnValue) {
                event.preventDefault();
            } else {
                event.returnValue = false;
            }
        };
    };
    //------------- UI -------------
    //-> 按钮
    PetUI.Button = (text) => {
        var button = PetUI.Create('button');
        // 设置样式
        button.classList = "PetUIButton";
        // 设置事件
        button.Click = null;
        button.AddHandler("click", (e) => {
            if (button.Click != undefined) { button.Click(); }
        });
        if (text) { button.innerText = text; }
        return button;
    };
    // 按钮颜色样式
    PetUI.Button.style = [
        // 背景颜色
        "Red",
        "Blue",
        "Green",
        "Gray",
        "Black",
        // 点燃颜色
        "HoverRed",
        "HoverBlue",
        "HoverGreen",
        "HoverGray",
        "HoverBlack",
        // 按下颜色
        "ActiveRed",
        "ActiveBlue",
        "ActiveGreen",
        "ActiveGray",
        "ActiveBlack"
    ];
    // 按钮动画
    PetUI.Button.styleAnimation = {
        "Arrows": "<span>按钮动画</span>"
    };
    //-> 选择按钮
    PetUI.Selection = (text) => {
        var div = PetUI.Create('div');
        div.classList = 'PetUISwitch CloseGlowing';
        // 复选框
        var input = div.Create('input');
        input.classList = 'input';
        input.type = 'checkbox';
        div.input = input;
        // 滑块
        var slider = div.Create('label');
        slider.classList = 'slider';
        div.slider = slider;
        // 名称
        if (text) {
            var label = div.Create('label');
            label.classList = 'label';
            label.innerText = text;
            div.label = label;
        }
        // 状态
        div.Checked = false;
        Object.defineProperty(div, "Checked", {
            set: function (name) {
                input.checked = name;
            },
            get: function () {
                return input.checked;
            }
        });
        // 事件设置
        div.Click = null;
        slider.AddHandler("click", (e) => {
            div.Checked = !input.checked;
            if (div.Click) {
                div.Click(div, e);
            }
        });
        return div;
    };
    // 选择按钮样式
    PetUI.Selection.style = [
        "primary",
        "info",
        "success",
        "danger",
        "warning"
    ];
    // 选择按钮效果样式
    PetUI.Selection.styleEffect = [
        "CloseGlowing"
    ];
    //-> 进度条
    PetUI.ProgressBar = (width, percent) => {
        var div = PetUI.Create('div');
        div.classList = "PetUIProgressBar CloseGlowing";
        // 进度条背景
        var Background = div.Create("div");
        Background.classList = "PetUIProgressBar background";
        div.Background = Background;
        // 进度条颜色
        var Colop = Background.Create("div");
        Colop.classList = "PetUIProgressBar color";
        div.Colop = Colop;
        // 进度条大小
        div.CSS({
            width: width ? width : '200px'
        });
        // 进度条百分比
        div.__Percent = percent ? percent : 0;
        Colop.CSS({ 'width': percent ? percent + '%' : "1px" });
        var lock = false;
        div.Percent = (percent) => {
            if (lock == true) { return; }
            if (percent) {
                if (div.__Percent != percent) {
                    lock = true;
                    if (div.__Percent > percent) {
                        let n = div.__Percent - percent;
                        let id = setInterval(() => {
                            n--;
                            Colop.CSS({ 'width': percent + n + '%' });
                            if (n == 0) {
                                lock = false;
                                div.__Percent = percent;
                                clearTimeout(id);
                            }
                        }, 20);
                    } else {
                        let n = div.__Percent;
                        let id = setInterval(() => {
                            n++;
                            Colop.CSS({ 'width': n + '%' });
                            if (n == percent) {
                                lock = false;
                                div.__Percent = percent;
                                clearTimeout(id);
                            }
                        }, 20);
                    }
                    return div;
                }
            }
            return div.__Percent;
        };
        div.Percent(percent);
        // 进度条样式
        div.ClassColop = (...e) => { Colop.Class(...e); };
        return div;
    };
    // 进度条样式
    PetUI.ProgressBar.style = [
        'color-1',
        'color-2',
        'color-3',
        'color-4',
        'color-5',
        'color-6',
        'color-7',
        'color-8'
    ];
    PetUI.ProgressBar.styleEffect = [
        "BackgroundAnime",
        "CloseGlowing"
    ];
    //-> 圆形进度条
    PetUI.ProgressBarRound = (width) => {
        var div = PetUI.Create('div');
        div.classList = "PetUIProgressBar Round";
        div.Create("i");
        if (width) {
            div.CSS({ "font-size": width + "px" });
        }
        return div;
    };
    // 导航栏
    PetUI.Navbar = () => {
        var div = PetUI.Create('ul');
        div.classList = "Navbar Description";
        div.Submenu = (text) => {
            var menu = div.Create('div');
            if (text) { menu.innerText = text; }
            // 设置事件
            menu.Click = null;
            menu.AddHandler("click", (e) => {
                if (menu.Click != undefined) { menu.Click(); }
            });
            return menu;
        };
        return div;
    };
    // 提示
    var Frame = PetUI.Create('div');
    Frame.classList = "Frame";
    Frame.Initialize = true;
    PetUI.Prompt = (notice) => {
        if (notice) {
            var div = Frame.Create('div');
            div.innerText = notice;
            window.setTimeout(() => {
                div.Destroy();
            }, 5000);
            // 返回底层
            if (Frame.Initialize) {
                Frame.Child();
                Frame.Initialize = false;
            }
            return div;
        } else {
            return Frame;
        }

    };
})();